import React, {CSSProperties} from "react";
import {Form as AntdForm, Row as AntdRow} from 'antd';
import {
    renderItems,
    VJsonComponent,
    VJsonComponentBase,
} from "../factory";
import _ from 'lodash'
import {Gutter} from "antd/lib/grid/row";
import {apply} from "..";

export interface DivVJsonProp {
    /**
     * 是否可见
     */
    visible?: boolean

    className?: string

    style?: CSSProperties

    /**
     * 内容元素
     */
    items: any[]
}

export interface DivState {

}

@VJsonComponent({
    view: 'div'
})
export default class Row extends VJsonComponentBase<DivVJsonProp, DivState> {
    static defaultProps = {
        visible: true,
        items: []
    }

    constructor(props: any) {
        super(props);

        _.defaults(
            props.vjson,
            Row.defaultProps
        )
    }

    render() {
        if (!this.props.vjson.visible) {
            return null
        }

        return (
            // @ts-ignore
            <div key={this.key} view_id={this.key} aria-roledescription={this.view}
                 className={apply(this, this.props.vjson.className)}
                 style={apply(this, this.props.vjson.style)}
            >
                {
                    ...renderItems(this, this.props.vjson.items)
                }
            </div>
        )
    }
}
